<template>
  <div>
    <van-field
      v-model="contentname"
      label-width="60"
      :label="label"
      :type="type"
      :placeholder="placeholder"
      :rule="rule"
    />
  </div>
</template>

<script>
export default {
  props: ['label', 'type', 'placeholder', 'rule'],
  data() {
    return {
      contentname: ''
    }
  },
  watch: {
    contentname() {
      this.handlerule()
    }
  },
  methods: {
    handlerule() {
      // console.log(this.rule)
      const rule = new RegExp(this.rule)  //字符串转成正则表达式
      // const rule = eval(this.rule)
      // console.log(rule)
      if(rule.test(this.contentname)) {
        console.log('符合要求')
        this.$emit('inputchange', this.contentname)
      } else {
        this.$emit('inputchange', '')
      }
    }
  }
}
</script>

<style>
</style>